<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="description" content="">
    <meta name="author" content="Mark Otto, Jacob Thornton, and Bootstrap contributors">
    <meta name="generator" content="Hugo 0.104.2">
    <title>Python Project</title>

    <link rel="canonical" href="https://getbootstrap.com/docs/5.2/examples/product/">
<link href="https://getbootstrap.com/docs/5.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-rbsA2VBKQhggwzxH7pPCaAqO46MgnOM80zW1RWuH61DGLwZJEdK2Kadq2F9CUG65" crossorigin="anonymous">

    <!-- Favicons -->
<link rel="apple-touch-icon" href="/docs/5.2/assets/img/favicons/apple-touch-icon.png" sizes="180x180">
<link rel="icon" href="/docs/5.2/assets/img/favicons/favicon-32x32.png" sizes="32x32" type="image/png">
<link rel="icon" href="/docs/5.2/assets/img/favicons/favicon-16x16.png" sizes="16x16" type="image/png">
<link rel="manifest" href="/docs/5.2/assets/img/favicons/manifest.json">
<link rel="mask-icon" href="/docs/5.2/assets/img/favicons/safari-pinned-tab.svg" color="#712cf9">
<link rel="icon" href="/docs/5.2/assets/img/favicons/favicon.ico">
<meta name="theme-color" content="#712cf9">
    <style>
      .bd-placeholder-img {
        font-size: 1.125rem;
        text-anchor: middle;
        -webkit-user-select: none;
        -moz-user-select: none;
        user-select: none;
      }

      @media (min-width: 768px) {
        .bd-placeholder-img-lg {
          font-size: 3.5rem;
        }
      }

      .b-example-divider {
        height: 3rem;
        background-color: rgba(0, 0, 0, .1);
        border: solid rgba(0, 0, 0, .15);
        border-width: 1px 0;
        box-shadow: inset 0 .5em 1.5em rgba(0, 0, 0, .1), inset 0 .125em .5em rgba(0, 0, 0, .15);
      }

      .b-example-vr {
        flex-shrink: 0;
        width: 1.5rem;
        height: 100vh;
      }

      .bi {
        vertical-align: -.125em;
        fill: currentColor;
      }

      .nav-scroller {
        position: relative;
        z-index: 2;
        height: 2.75rem;
        overflow-y: hidden;
      }

      .nav-scroller .nav {
        display: flex;
        flex-wrap: nowrap;
        padding-bottom: 1rem;
        margin-top: -1px;
        overflow-x: auto;
        text-align: center;
        white-space: nowrap;
        -webkit-overflow-scrolling: touch;
      }
    </style>
    <!-- Custom styles for this template -->
    <link href="https://getbootstrap.com/docs/5.2/examples/product/product.css" rel="stylesheet">
  </head>
<body>
<!-- 页面头部信息栏 -->
<header class="site-header sticky-top py-1">
  <nav class="container d-flex flex-column flex-md-row justify-content-between">
    <a class="py-2" href="#" aria-label="Product">
      <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" class="d-block mx-auto" role="img" viewBox="0 0 24 24"><title>Product</title><circle cx="12" cy="12" r="10"/><path d="M14.31 8l5.74 9.94M9.69 8h11.48M7.38 12l5.74-9.94M9.69 16L3.95 6.06M14.31 16H2.83m13.79-4l-5.74 9.94"/></svg>
    </a>
    <a class="py-2 d-none d-md-inline-block" href="#">首页</a>
    <a class="py-2 d-none d-md-inline-block" href="#">基础</a>
    <a class="py-2 d-none d-md-inline-block" href="#">控制流</a>
    <a class="py-2 d-none d-md-inline-block" href="#">列表</a>
    <a class="py-2 d-none d-md-inline-block" href="#">字典</a>
    <a class="py-2 d-none d-md-inline-block" href="#">集合</a>
    <a class="py-2 d-none d-md-inline-block" href="#">元组</a>
  </nav>
</header>
</body>
</html>  
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="description" content="">
    <meta name="author" content="Mark Otto, Jacob Thornton, and Bootstrap contributors">
    <meta name="generator" content="Hugo 0.104.2">
    <title>Product example · Bootstrap v5.2</title>

    <link rel="canonical" href="https://getbootstrap.com/docs/5.2/examples/product/">





<link href="https://getbootstrap.com/docs/5.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-rbsA2VBKQhggwzxH7pPCaAqO46MgnOM80zW1RWuH61DGLwZJEdK2Kadq2F9CUG65" crossorigin="anonymous">

    <!-- Favicons -->
<link rel="apple-touch-icon" href="/docs/5.2/assets/img/favicons/apple-touch-icon.png" sizes="180x180">
<link rel="icon" href="/docs/5.2/assets/img/favicons/favicon-32x32.png" sizes="32x32" type="image/png">
<link rel="icon" href="/docs/5.2/assets/img/favicons/favicon-16x16.png" sizes="16x16" type="image/png">
<link rel="manifest" href="https://getbootstrap.com/docs/5.2/assets/img/favicons/manifest.json">
<link rel="mask-icon" href="/docs/5.2/assets/img/favicons/safari-pinned-tab.svg" color="#712cf9">
<link rel="icon" href="/docs/5.2/assets/img/favicons/favicon.ico">
<meta name="theme-color" content="#712cf9">


    <style>
      .bd-placeholder-img {
        font-size: 1.125rem;
        text-anchor: middle;
        -webkit-user-select: none;
        -moz-user-select: none;
        user-select: none;
      }

      @media (min-width: 768px) {
        .bd-placeholder-img-lg {
          font-size: 3.5rem;
        }
      }

      .b-example-divider {
        height: 3rem;
        background-color: rgba(0, 0, 0, .1);
        border: solid rgba(0, 0, 0, .15);
        border-width: 1px 0;
        box-shadow: inset 0 .5em 1.5em rgba(0, 0, 0, .1), inset 0 .125em .5em rgba(0, 0, 0, .15);
      }

      .b-example-vr {
        flex-shrink: 0;
        width: 1.5rem;
        height: 100vh;
      }

      .bi {
        vertical-align: -.125em;
        fill: currentColor;
      }

      .nav-scroller {
        position: relative;
        z-index: 2;
        height: 2.75rem;
        overflow-y: hidden;
      }

      .nav-scroller .nav {
        display: flex;
        flex-wrap: nowrap;
        padding-bottom: 1rem;
        margin-top: -1px;
        overflow-x: auto;
        text-align: center;
        white-space: nowrap;
        -webkit-overflow-scrolling: touch;
      }
    </style>


    <!-- Custom styles for this template -->
    <link href="https://getbootstrap.com/docs/5.2/examples/product/product.css" rel="stylesheet">
  </head>
</head>
<body>
<main>
 <div class="position-relative overflow-hidden p-3 p-md-5 m-md-3 text-center bg-light">
    <div class="col-md-5 p-lg-5 mx-auto my-5">
      <h1 class="display-4 fw-normal">欢迎来到YY的期末项目2022-2023</h1>
		<p class="lead fw-normal">前修课程：网页设计制作、TCP/IP、HTTP. </p>
        <p class="lead fw-normal">Python期末作品 </p>
        <p class="lead fw-normal">制作人：晁菱阳 </p>
      <p class="lead fw-normal">基本实现页面跳转.</p>
      <a class="btn btn-outline-secondary" href="entry.html">元音查询</a>
    </div>
    <div class="product-device shadow-sm d-none d-md-block"></div>
    <div class="product-device product-device-2 shadow-sm d-none d-md-block"></div>
  </div>
     <div class="d-md-flex flex-md-equal w-100 my-md-3 ps-md-3">
    <div class="text-bg-dark me-md-3 pt-3 px-3 pt-md-5 px-md-5 text-center overflow-hidden">
      <div class="my-3 py-3">
        <h2 class="display-5">购物车小项目</h2>
        <p class="lead">【实践】购买商品的Python学习项目.</p>
      </div>
      <div class="bg-light shadow-sm mx-auto" style="width: 80%; height: 300px; border-radius: 21px 21px 0 0;"></div>
    </div>
    <div class="bg-light me-md-3 pt-3 px-3 pt-md-5 px-md-5 text-center overflow-hidden">
      <div class="my-3 p-3">
        <h2 class="display-5">猜数字小项目</h2>
        <p class="lead">【控制流】1-100猜数字小游戏学习项目.</p>
      </div>
      <div class="bg-dark shadow-sm mx-auto" style="width: 80%; height: 300px; border-radius: 21px 21px 0 0;"></div>
    </div>
  </div>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>
        Home Page
    </title>
    <link
      href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css"
      rel="stylesheet"
      integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3"
      crossorigin="anonymous"
    />
    <style>
      .bd-navbar {
        min-height: 4rem;
        background-color: rgb(48, 54, 67);
        box-shadow: 0 0.5rem 1rem rgb(0 0 0 / 5%),
          inset 0 -1px 0 rgb(0 0 0 / 10%);
      }
    </style>
  </head>
  <body>
    <header class="p-3 text-white bd-navbar" style="user-select: auto">
      <div class="container" style="user-select: auto">
        <div
          class="d-flex flex-wrap align-items-center justify-content-center justify-content-lg-start"
          style="user-select: auto"
        >
          <a
            href="/"
            class="d-flex align-items-center mb-2 mb-lg-0 text-white text-decoration-none"
            style="user-select: auto"
          >
          </a>

          <ul
            class="nav col-12 col-lg-auto me-lg-auto mb-2 justify-content-center mb-md-0"
            style="user-select: auto"
          >
            <li style="user-select: auto">
              <a
                href="{{ url_for('home_page') }}"
                class="nav-link px-2 text-secondary"
                style="user-select: auto"
                >Home</a
              >
            </li>
            <li style="user-select: auto">
              <a
                href="#"
                class="nav-link px-2 text-white"
                style="user-select: auto"
                >Features</a
              >
            </li>
            <li style="user-select: auto">
              <a
                href="#"
                class="nav-link px-2 text-white"
                style="user-select: auto"
                >Pricing</a
              >
            </li>
            <li style="user-select: auto">
              <a
                href="#"
                class="nav-link px-2 text-white"
                style="user-select: auto"
                >FAQs</a
              >
            </li>
            <li style="user-select: auto">
              <a
                href="#"
                class="nav-link px-2 text-white"
                style="user-select: auto"
                >About</a
              >
            </li>
          </ul>

          <form
            class="col-12 col-lg-auto mb-3 mb-lg-0 me-lg-3"
            style="user-select: auto"
          >
            <input
              type="search"
              class="form-control form-control-dark"
              placeholder="Search..."
              aria-label="Search"
              style="user-select: auto"
            />
          </form>

          <div class="text-end" style="user-select: auto">
            <button
              type="button"
              class="btn btn-outline-light me-2"
              style="user-select: auto"
            >
              Login
            </button>
            <button
              type="button"
              class="btn btn-warning"
              style="user-select: auto"
            >
              Sign-up
            </button>
          </div>
        </div>
      </div>
    </header>
    <main>
      <section class="p-5 text-center text-sm-start">
        <div class="container">
          <div class="d-flex">
            <div>
              <h1>Flask_Web Develop</h1>
              <p>where there is a will there is a way</p>
              <p>
                Lorem ipsum, dolor sit amet consectetur adipisicing elit.
                Accusamus dolorem est, eaque voe aliquam provident consequatur,
                nobis quo perspiciatis id doloremquluptas veritatis ipsam fuga,
                dolore officiis voluptatibus optio. Fugiat, et.
              </p>
              <div class="pt-5">
                <div class="card bg-light text-dark">
                  <div class="card-body text-center">
                    <div class="card-title">作业</div>
                    <div class="card-text text-lg-start">
                      Lorem ipsum dolor sit amet consectetur a Lorem ipsum dolor
                      sit amet consectetur adipisicing elit. Ex nostrum quas sit
                      inventore eveniet sint, perferendis exercitationem optio
                      molestiae veniam iure at obcaecati quidem iusto quos
                      fugiat aperiam error consequuntur!
                    </div>
                    <a href="{{ url_for('spell_name') }}" class="btn btn-primary mt-2">名字拼写</a>
                    <a href="{{ url_for('vowels_search') }}" class="btn btn-primary mt-2">字母查询</a>
                    <a href="#" class="btn btn-primary mt-2">名字拼写</a>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </section>
    </main>
    <script
      src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js"
      integrity="sha384-ka7Sk0Gln4gmtz2MlQnikT1wXgYsOg+OMhuP+IlRH9sENBO0LRn5q+8nbTov4+1p"
      crossorigin="anonymous"
    ></script>
  </body>
</html>

    </main>
<script src="https://getbootstrap.com/docs/5.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-kenU1KFdBIe4zVF0s0G1M5b4hcpxyD9F7jL+jjXkk+Q2h455rYXK/7HAuoJl+0I4" crossorigin="anonymous"></script>
	<footer class="container py-5">
  <div class="row">
    <div class="col-12 col-md">
      <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" class="d-block mb-2" role="img" viewBox="0 0 24 24"><title>Product</title><circle cx="12" cy="12" r="10"></circle><path d="M14.31 8l5.74 9.94M9.69 8h11.48M7.38 12l5.74-9.94M9.69 16L3.95 6.06M14.31 16H2.83m13.79-4l-5.74 9.94"></path></svg>
      <small class="d-block mb-3 text-muted">© 2022-2023</small>
    </div>
    <div class="col-6 col-md">
      <h5>Features</h5>
      <ul class="list-unstyled text-small">
        <li><a class="link-secondary" href="#">Cool stuff</a></li>
        <li><a class="link-secondary" href="#">Random feature</a></li>
        <li><a class="link-secondary" href="#">Team feature</a></li>
        <li><a class="link-secondary" href="#">Stuff for developers</a></li>
        <li><a class="link-secondary" href="#">Another one</a></li>
        <li><a class="link-secondary" href="#">Last time</a></li>
      </ul>
    </div>
    <div class="col-6 col-md">
      <h5>Resources</h5>
      <ul class="list-unstyled text-small">
        <li><a class="link-secondary" href="#">Resource name</a></li>
        <li><a class="link-secondary" href="#">Resource</a></li>
        <li><a class="link-secondary" href="#">Another resource</a></li>
        <li><a class="link-secondary" href="#">Final resource</a></li>
      </ul>
    </div>
      <div class="col-6 col-md">
      <h5>About</h5>
      <ul class="list-unstyled text-small">
        <li><a class="link-secondary" href="#">广州南方学院</a></li>
        <li><a class="link-secondary" href="#">文学与传媒学院-网络与新媒体</a></li>
        <li><a class="link-secondary" href="#">1920954348@qq.com</a></li>
        <li><a class="link-secondary" href="#">网站制作人：晁菱阳</a></li>
      </ul>
    </div>
  </div>
</footer>
 <footer class="p-5 bg-dark text-white text-center">
      <div class="container">
        <p class="lead">Copyright &copy; 2023 YY</p>
      </div>
    </footer>
</body>
</html>